.container{/*body*/
	background: white;
	/*自适应不用设置大小    大小跟随屏幕动*/
}
#top{
	background: green;
	margin-top: 16px;
	padding:15px;
}
#top h1{
	color: white;
	font-weight: bold;
	margin-top: 12px;
}
#top p{
	display: block;
	color: white;
	margin-top: -30px;
}


#menubar{/*div*/
	float: left;
	width:20%;
}
#menulist{/*ul*/
	list-style-type: none;
	text-align: left;
	padding-top: 2px;
	width:100%;
}
.menuitem{/*li*/
	background: lightgray;
	border: 1px solid lightslategrey;
	margin-top: 4px;
	margin-left: -39px;
	padding-top:6px;
	height: 23px;
	width:100%;
}

#main{
	float: left;
	background: white;
	margin: 0px 10px;
	margin-bottom: 10px;
	width: 57%;
}
#main h1{
	font-weight: bold;
	margin-top: 30px;
	margin-left: 10px;
	margin-right: 10px;
}
#main p{
	line-height: 23px;
	border-radius: 4px;
	margin:0px 10px;
}
#main p a{
	color: black;
}
#main p a:hover{
	color: green;
}
#main h2{
	font-weight: bold;
	margin-left: 10px;
	margin-right: 10px;
}

#sidebar{
	float: right;
	background: skyblue;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-bottom: 10%;
	width: 20%;
}
#sidebar h3{
	color: white;
	font-weight: bold;
	margin-left: 10px;
}
#sidebar p{
	color: white;
	margin-left: 10px;
}
   
   


#bottom{
	clear: both;
	background: saddlebrown;
	border: 1px solid lightslategrey;
	background: lightgray;
	padding-top: 16px;
	padding-bottom: 2%;
}
#bottom p{
	text-align: center;
	line-height: 10px;
	font-size: 14px;
}




/*自适应*/
@media only screen and (max-width:800px ) {
	#sidebar{
		clear: both;
		color: saddlebrown;
		position: relative;
		width: 100%;
	}
	#main{
		width: 78%;
		margin-right:0;
		
	}
}

@media only screen and (max-width:700px ) {
	
	#menubar{/*div*/
		width:100%;
	}

	#main{
		width: 100%;
	}
	#main h1{
		margin-top: 10px;
	}
}